<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./jquery.min.js"></script>
</head>

<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script>
    // jq 会有2个大的特点 1. 隐式迭代 2.链式操作；
    // 筛选器 
    // 1.获取第一个元素；
    // 原生的js所有的都是赋值操作
    // document.onclick = function(){

    // }

    // jq操作都是函数操作 ：
    // 1.first：获取第一个元素
    // $(document).click(function(){
    //     // $("li:first")
    //     // 链式操作 
    //     $("li").first().css("color","red");

    // })

    // 2.获取最后一个元素 last 
    // $(document).click(function(){
    //     $("li").last().css("color","red");
    // })

    // 3.选取指定的元素  eq
    // $(document).click(function(){
    //     $("li").eq(1).css("color","red");
    // })

    // 4.元素的回滚 end
    // document.onclick = function(){
    //     $("li").eq(1).eq(0).end().end().eq(3).css("color","red");
    // }

    // 5.查找下一个兄弟元素 next
        // document.onclick = function(){
        //     $("li").eq(1).next().css("color","blue");
        // }

        // 6.查找上一个兄弟元素  prev
        document.onclick = function(){
            $("li").eq(1).prev().css("color","red");
        }







    </script>
</body>

</html>